<template>

    <el-dialog title="编辑拍卖会" :visible="isShowEditDialog" @close="dialogClose" width="80%" :close-on-click-modal="false">

        <el-form :model="ruleForm" :rules="rules" ref="auctionEdit" label-width="auto" class="demo-ruleForm">
            <el-row :gutter="24">
                <el-col :span="12">
                    <el-form-item label="委托合同编号：" prop="wthtbh">
                        <el-input type="text" v-model="ruleForm.wthtbh" disabled>
                        </el-input>
                    </el-form-item>

                    <el-form-item label="拍卖会类型：" prop="pmhlx">
                        <el-select v-model="ruleForm.pmhlx" style="width:100%" clearable>
                            <el-option
                                v-for="item in this.auctionTypeOptions"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- <el-form-item label="发布状态：" prop="fbzt">
                        <el-select v-model="ruleForm.fbzt" style="width:100%" clearable>
                            <el-option
                                v-for="item in this.auctionfbzt"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item> -->
                    <el-form-item label="开拍时间：" prop="kpsj">
                        <el-date-picker v-model="ruleForm.kpsj" type="datetime" placeholder="选择日期时间"
                            value-format="yyyy-MM-dd HH:mm:ss" style="width:100%" disabled>
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item label="拍卖方式：" prop="pmfs">
                        <el-radio v-model="ruleForm.pmfs" label='增价拍' disabled></el-radio>
                        <el-radio v-model="ruleForm.pmfs" label='降价拍' disabled></el-radio>
                        <el-radio v-model="ruleForm.pmfs" label='V字拍' disabled></el-radio>
                    </el-form-item>
                    <el-form-item label="全场拍报名：" prop="qcpbm">
                            <el-radio label='true' v-model="ruleForm.qcpbm">支持</el-radio>
                            <el-radio label='false' v-model="ruleForm.qcpbm">不支持</el-radio>
                    </el-form-item>
                    <!-- <el-form-item label="全场保证金：" prop="money">
                        <el-input type="number" placeholder="选择输入您全场拍的保证金金额" v-model="ruleForm.money">
                        </el-input>
                    </el-form-item> -->
                    <el-form-item label="封面：" prop="fm">
                        <el-upload class="avatar-uploader" :action='actionLogo' list-type="picture-card"
                            :show-file-list="false" :on-success="logohandleAvatarSuccess">
                            <img v-if="this.ruleForm.fm" :src="this.ruleForm.fm" class="avatar">
                            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                        </el-upload>
                    </el-form-item>
                    <el-form-item label="拍卖企业：" prop="pmqy">
                        <el-input type="text" v-model="ruleForm.pmqy" disabled>
                        </el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="12">
                    <el-form-item v-if="this.ruleForm.wthtmc" label="委托合同名称：" prop="wthtmc">
                        <el-input type="text" v-model="ruleForm.wthtmc" disabled>
                        </el-input>
                    </el-form-item>
                    <el-form-item label="拍卖会名称：" prop="pmhmc">
                        <el-input type="text" v-model="ruleForm.pmhmc">
                        </el-input>
                    </el-form-item>
                    <!-- <el-form-item label="拍卖会状态：" prop="pmhzt">
                        <el-select v-model="ruleForm.pmhzt" style="width:100%" clearable>
                            <el-option
                                v-for="item in this.auctionzt"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item> -->
                    <el-form-item label="拍卖师选择：" prop="pmsbh">
                        <el-select v-model="ruleForm.pmsbh" style="width:100%" clearable>
                            <el-option
                                v-for="item in this.pmsOptions"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="是否申请直播：" prop="sqzb">
                            <el-radio label='true' v-model="ruleForm.sqzb">申请</el-radio>
                            <el-radio label='false' v-model="ruleForm.sqzb">不申请</el-radio>
                    </el-form-item>
                    <el-form-item label="报名截止时间：" prop="bmjzsj">
                        <el-date-picker v-model="ruleForm.bmjzsj" type="datetime" placeholder="选择日期时间"
                            value-format="yyyy-MM-dd HH:mm:ss" style="width:100%">
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item label="报名需要提交材料：" prop="bmtjcl">
                            <el-radio label='true' @change="show" v-model="ruleForm.bmtjcl">需要</el-radio>
                            <el-radio label='false' @change="show" v-model="ruleForm.bmtjcl">不需要</el-radio>
                    </el-form-item>
                    <el-form-item label="上传材料名称：" prop="scclmc">
                        <el-select v-model="ruleForm.scclmc" style="width:100%" clearable :disabled="able" @change="fx">
                            <el-option
                                v-for="item in this.auctionscclmc"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- <el-form-item label="备注：" prop="remark">
                        <el-input type="textarea" :rows="4" v-model="ruleForm.remark" disabled>
                        </el-input>
                    </el-form-item> -->
                    <el-form-item label="直播间推流地址：" prop="zbjtldz">
                        <el-input type="text" v-model="ruleForm.zbjtldz">
                        </el-input>
                    </el-form-item>
                    <el-form-item label="联系方式：" prop="lxfs">
                        <el-input type="text" v-model="ruleForm.lxfs" disabled>
                        </el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="submitForm()" class="pull-right margin-l-25">确定
                        </el-button>
                        <el-button @click="dialogClose" class="pull-right">取消</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </el-dialog>

</template>
<script>
import { editData,getWthtbhData } from '@/api/auctionManage/auctionManage';
import { getSelectData,getPms,getPmsxm } from '@/api/dictionary';
export default {
    name:'auctionEdit',
    data () {
        return {
            ruleForm: {
                // "id": 2,
                // "pmhbh": "",//拍卖会编号
                // "pmhmc": "",//拍卖会名称
                // "pmhlx": '',//拍卖会类型
                // "fbzt": '',//发布状态
                // "pmhzt": '',//拍卖会状态
                // "kpsj": "",//开拍时间
                // "pms": "",//拍卖师
                "sqzb": '',//申请直播
                pmfs: '',//拍卖方式
                // "bmjzsj": "",//报名截止时间
                "qcpbm": '',//全场拍报名
                "bmtjcl": '',//报名是否提交材料
                "fm": "",//封面
                // "scclmc": "",//上传材料名称
                // "remark": '',
                // "wthtbh": "",//委托合同编号
                // "zbjtldz": "",//直播间推流地址
                // "pmqy": "",//拍卖企业
                // "lxfs": "",//联系方式
                wthtmc:'',
            },
            actionLogo: '/api/auctions/uploadfm',
            disabled: false,
            able: false,
            x: '0',
            wthtbhIsNull: true,
            auctionTypeOptions: [],
            auctionfbzt:[],
            auctionzt:[],
            pmsOptions: [],
            auctionscclmc:[],
            rules: {
                pmhmc: [
                    { required: true, message: '请选择拍卖会名称', trigger: 'change' }
                ],
                pmhlx: [
                    { required: true, message: '请选择活动类型', trigger: 'change' }
                ],
                fbzt: [
                    { required: true, message: '请选择发布状态', trigger: 'change' }
                ],
                pmhzt: [
                    { required: true, message: '请选择拍卖会状态', trigger: 'change' }
                ],
                kpsj: [
                    { required: true, message: '请选择日期', trigger: 'change' }
                ],
                pmsbh: [
                    { required: true, message: '请选择拍卖师', trigger: 'change' }
                ],
                sqzb: [
                    { required: true, message: '请选择是否申请直播', trigger: 'change' }
                ],
                bmjzsj: [
                    { required: true, message: '请选择日期', trigger: 'change' }
                ],
                qcpbm: [
                    { required: true, message: '请选择是否支持', trigger: 'change' }
                ],
                pmfs: [
                    { required: true, message: '请选择一种拍卖方式', trigger: 'change' }
                ],
                qcpbm: [
                    { required: true, message: '请选择是否支持全场拍', trigger: 'change' }
                ],
                bmtjcl: [
                    { required: true, message: '请选择是否需要', trigger: 'change' }
                ],
                fm: [
                    { required: true, message: '请选择封面', trigger: 'change' }
                ],
                wthtbh: [
                    { required: true, message: '请选择委托合同编号', trigger: 'change' }
                ],
                pmqy: [
                    { required: true, message: '请输入拍卖企业', trigger: 'change' }
                ],
                // lxfs: [
                //     { required: true, message: '请输入联系方式', trigger: 'change' }
                // ],
            },

        };
    },
    props: {
        isShowEditDialog: {
            type: Boolean
        },
        rowData: {
            type: Object
        }
    },
    methods: {
        formatTime(time){
            var dateee = new Date(time).toJSON();
            return new Date(+new Date(dateee) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '');
        },
        handleRemove (file) {
            console.log(file);
        },
        logohandleAvatarSuccess (file) {
            console.log(file);
            console.log(file.code);
            console.log(file.data);
            this.ruleForm.fm = file.data;
        },

        submitForm () {
            this.ruleForm.kpsj = this.formatTime(this.ruleForm.kpsj);
            // this.ruleForm.bmjzsj = this.formatTime(this.ruleForm.bmjzsj);
            this.$refs.auctionEdit.validate((valid) => {
                if (valid) {
                    console.log(this.ruleForm);
                    if (this.ruleForm.bmtjcl == 1) {
                        // if (this.x == 0) {
                        //     this.$message.error('请输入材料名称');
                        //     return ;
                        // }
                        // else {
                            this.edit(this.ruleForm);
                            this.dialogClose();
                        // }

                    }
                    else {
                        this.edit(this.ruleForm);
                        this.dialogClose();
                    }
                }
                else {
                    return ;
                }
            });
        },
        show (e) {
            console.log(e);
            if (e == 'false') {
                this.able = true;
            }
            else {
                this.able = false;
            }
        },
        fx (e) {
            console.log(e);
            this.x = e;
        },
        dialogClose () {
            this.$emit('dialogClose');
            this.$emit('getList');
        },
        edit(ruleForm){
            console.log(ruleForm);
            editData(ruleForm).then((res) => {
                if(res){
                    console.log(res.msg);
                }
            })
        },
        getSelectAuctionType(){
            let data = '拍卖会类型';
            getSelectData(data).then((res) => {
                if(res){
                    for(let item in res.data){
                        this.auctionTypeOptions.push({
                            label: res.data[item],
                            value: res.data[item]
                        })
                    }
                }
                // console.log(this.auctionTypeOptions);
            })
        },
        getPmsbh(){
            getPms().then((res) => {
                if(res){
                    for(let item in res.data.list){
                        this.pmsOptions.push({
                            label: res.data.list[item].pmsxm,
                            value: res.data.list[item].pmsbh
                        })
                    }
                }
            })
        },
        getPmsName(data){
            getPmsxm(data).then((res) => {
                if(res){
                    return res.data.pmsxm;
                }
            })
        },
        getWthtmc(data){
            getWthtbhData(data).then((res) => {
                if(res){
                    console.log('委托合同名称res',res.data.wthtmc);
                    this.ruleForm.wthtmc = res.data.wthtmc;
                    console.log('委托合同名称res', this.ruleForm.wthtmc);
                }
            })
        },
        getFbzt(){
            let data = '发布状态';
            getSelectData(data).then((res) => {
                if(res){
                    for(let item in res.data){
                        this.auctionfbzt.push({
                            label: res.data[item],
                            value: res.data[item]
                        })
                    }
                }
                // console.log(this.auctionTypeOptions);
            })
        },
        getPmhzt(){
            let data = '拍卖会状态';
            getSelectData(data).then((res) => {
                if(res){
                    for(let item in res.data){
                        this.auctionzt.push({
                            label: res.data[item],
                            value: res.data[item]
                        })
                    }
                }
                // console.log(this.auctionTypeOptions);
            })
        },  
        getScclmc(){
            let data = '上传材料名称';
            getSelectData(data).then((res) => {
                if(res){
                    for(let item in res.data){
                        this.auctionscclmc.push({
                            label: res.data[item],
                            value: res.data[item]
                        })
                    }
                }
                // console.log(this.auctionTypeOptions);
            })
        },
       
       
    },
    created(){
        
        this.ruleForm = Object.assign({},this.rowData)
        this.getSelectAuctionType();
        this.getPmsbh();
        this.getWthtmc(this.rowData.wthtbh);

        this.ruleForm.bmtjcl = ""+this.rowData.bmtjcl;
        this.getFbzt();
        this.getPmhzt();
        this.getScclmc();
        this.show(this.ruleForm.bmtjcl);
        if(this.ruleForm.sqzb == '是'){
            this.ruleForm.sqzb = 'true';
        }
        else{
            this.ruleForm.sqzb = 'false';
        }
        if(this.ruleForm.qcpbm == '是'){
            this.ruleForm.qcpbm = 'true';
        }
        else{
            this.ruleForm.qcpbm = 'false';
        }
        
    }



}
</script>
<style scoped lang="less">
    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }

    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }

    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
    }

    .avatar {
        width: 146px;
        height: 146px;
        object-fit: contain;
        display: block;
    }
</style>